<template>
    <s-table ref="tableRef" :data="loadData"  :scroll="{ x: 1200, }"  :columns="columns" :pagination="false" class="mb-2">
        <template #bodyCell="{ column, record, index }">
            <template v-if="column.key === 'index'">
                {{ index + 1 }}
            </template>
        </template>
    </s-table>
</template>

<script setup name="invitebid">
import api from '@/api/pm/cost/realcost'
const props = defineProps({
    proId: {
        type: String,
    },
})
const { proId } = toRefs(props)

const columns = [
    {
        title: '序号',
        dataIndex: 'index',
        key: 'index',
        width: 80,
        align: "center",
    },

    {
        title: '项目编号',
        dataIndex: 'code',
        key: 'code',
        width: 180,
        align: "center",
    },
    {
        title: '项目名称',
        dataIndex: 'name',
        key: 'name',
        width: 180,
        align: "center",
    },

    {
        title: '材料成本',
        dataIndex: 'materialCost',
        key: 'materialCost',
        width: 120,
        align: "center",
    },
    {
        title: '劳务成本',
        dataIndex: 'laborCost',
        key: 'laborCost',
        width: 120,
        align: "center",
    },

    {
        title: '机械费用',
        dataIndex: 'machineCost',
        key: 'machineCost',
        width: 120,
        align: "center",
    },
    {
        title: '其他费用',
        dataIndex: 'otherCost',
        key: 'otherCost',
        width: 120,
        align: "center",
    },
    {
        title: '成本总额',
        dataIndex: 'totalCost',
        key: 'totalCost',
        width: 120,
        align: "center",
    },
    {
        title: '预算偏差率',
        dataIndex: 'budgetRate',
        key: 'budgetRate',
        width: 120,
        align: "center",
    },
    {
        title: '负责人',
        dataIndex: 'director',
        key: 'director',
        width: 120,
        align: "center",
    },
 
]

const tableRef = ref()
const loadData = (parameter) => {
    const searchFormState = ref({
        proId: proId
    })
    searchFormState.value.current = parameter.current
    searchFormState.value.size = parameter.size
    return api.page(searchFormState.value).then((res) => {
        return res
    })
}



watch(
    () => props.proId,
    (newVal, oldVal) => {
        if (newVal) {
            nextTick(() => {
                tableRef.value.refresh(true)
            })
        }
    },
    { deep: true, immediate: true }
)

</script>
